<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org" lang="zh_CN">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <!-- <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> -->
    <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/css/materialize.min.css"/> -->
    <link rel="stylesheet" href="/css/materialize.min.css"/>

    <link rel="stylesheet" href="/css/comm100-new.css" />

    <title>Comm100 - 高效在线客服系统解决方案</title>

  </head>
  <body>
    <nav class="top-nav z-depth-2">
      <div class="nav-wrapper white">
        <div class="brand-logo">
          <a href="/" class="logo-link"><img class="logo-img" src="img/Comm100_logo.png" /></a>
          <span class="brand-title">高效在线客服系统</span>
        </div>
        <ul id="nav-mobile" class="right hide-on-med-and-down" style="">
          <li><a href="javascript:;" class="login-button" th:if="${notLogin}">登录</a></li>
          <li>
            <a href="javascript:;" class="register-button waves-effect waves-light btn" th:if="${notLogin}">注册</a>
          </li>
        </ul>
      </div>
    </nav>
    <main class="container">
      <div class="slogan-warpper">
        <h1 class="slogan-title">企业在线聊天软件</h1>
        <p class="slogan-text">实时留住网站访客。提高客户转换率、销售量和客户满意度。</p>
      </div>
      <a class="register-button waves-effect waves-light btn" href="javascript:;">
        免费试用
      </a>
    </main>
    <div class="login-layer" hidden="true">
      <div class="login-panel"  style="display: none">
        <div class="login-panel-header">
          <b class="login-panel-header-status">登录</b>
          /
          <a class="login-panel-header-trans" href="javascript:;">注册</a>
          <b class="login-panel-close">x</b>
        </div>
        <form class="login-panel-body-login container" th:action="@{/login}" action="/postLogin" method="post" >
          <div class="input-field">
            <input id="first_name-login" type="text"  name="username" class="validate" />
            <label for="first_name-login">用户名</label>
          </div>
          <div class="input-field">
            <input id="password-login" type="password" name="password" class="validate" />
            <label for="password-login">密码</label>
          </div>
          <button class="login-panel-body-submit btn" type="submit">登录</button>
        </form>        
      </div>

      <div class="register-panel" style="display: none">
        <div class="login-panel-header">
          <b class="login-panel-header-status">注册</b>
          /
          <a class="login-panel-header-trans" href="javascript:;">登录</a>
          <b class="login-panel-close">x</b>
        </div>
        <form class="login-panel-body-register container"  th:action="@{/register}" action="/postRegister" method="post">
          <div class="input-field">
            <input id="first_name-register" type="text" class="validate"  name="username" />
            <label for="first_name-register">用户名</label>
          </div>
          <div class="input-field">
            <input id="email-register" type="email" class="validate"  name="email" />
            <label for="email-register">邮箱</label>
          </div>
          <div class="input-field">
            <input id="password-register" type="password" class="validate"  name="password" />
            <label for="password-register">密码</label>
          </div>
          <button class="login-panel-body-submit btn" type="submit">注册</button>
        </form>
        
      </div>

      
    </div>
    <script src="js/jquery-2.1.1.min.js"></script>
    <script src="js/materialize.min.js"></script>
    <script src="js/comm100-new.js"></script>
  </body>
</html>
